<template>
	<view class="container" style="background: url('/static/public/loginBgc.png') no-repeat; background-size: 100%">
		<view class="register_box">
			<view class=""
				style="font-size: 36rpx;font-family: PingFang SC, PingFang SC;font-weight: bold;color: #1e84f1;text-align: center;margin-bottom: 50rpx;">
				{{$t('login.name14')}}
			</view>
			<view class="register_item">
				<input type="text" placeholder-class="inputPlaceholder" placeholder="请输入手机号" v-model="mobile">
			</view>
			<!-- <view class="register_item" >
				<input type="text" maxlength="6" placeholder-class="inputPlaceholder" :placeholder="$t('user.name44')" v-model="code" >
				<text class="code" @click="getCode">{{tip}}</text>
			</view> -->
			<view class="register_item">
				<input type="text" placeholder-class="inputPlaceholder" :placeholder="$t('login.name15')"
					v-model="truename">
			</view>
			<view class="register_item">
				<input type="text" :disabled="disabled" placeholder-class="inputPlaceholder"
					:placeholder="$t('login.name16')" v-model="invitation">
			</view>
			<view class="register_item">
				<input type="text" placeholder-class="inputPlaceholder" :placeholder="$t('login.name17')"
					v-model="password">
			</view>
			<view class="register_item">
				<input type="text" placeholder-class="inputPlaceholder" :placeholder="$t('user.name54')"
					v-model="paypwd">
			</view>
			<view class="flex-between" style="justify-content: flex-end; margin-right: 20rpx;">
				<text @click="$fun.jump(`/pageA/public/login`)"
					style="z-index: 100;color: #d6d6d6;font-size: 22rpx;;margin-right: 5rpx;">
					{{$t('login.name8')}}
				</text>
				<u-icon name="lock" color="#d6d6d6" size="15"></u-icon>
			</view>
			<button class="register_button" @click="toLogin" :disabled="logining">
				{{$t('login.name18')}}
			</button>
			<!-- <view class="register-section" >
				<view class="" >
						<checkbox style="transform:scale(0.6)" @click="isCh=!isCh" :checked="isCh" /><text style="color: #606266;">我已同意 <text @click="$fun.jump('/pageB/noticeList/noticeInfo?name=用户政策&type=16')">用户政策</text>   和  <text @click="$fun.jump('/pageB/noticeList/noticeInfo?name=隐私政策&type=15')">隐私政策</text> </text>
				</view>
				<view class="">
					已有账号?
					<text @click="$fun.jump(`/pageA/public/login`,3,0)">马上登录</text>
				</view>
			</view> -->
		</view>

	</view>
</template>

<script>
	import {
		mapMutations
	} from 'vuex';

	export default {
		data() {
			return {
				email: '',
				mobile: '',
				truename: '',
				code: '',
				invitation: '',
				logining: false,
				loginList: [],
				password: "",
				paypwd: "",
				tip: this.$t('login.name10'),
				timer: null,
				event: 'register',
				config: 0,
				configObj: {},
				disabled: false,
				isCh: false
			}
		},
		onLoad(Option) {
			const scene = decodeURIComponent(Option.scene)
			if (scene !== "undefined") {
				this.invitation = scene
				this.disabled = true
			}
			if (Option.invitation) {
				this.invitation = Option.invitation
				this.disabled = true
			}

		},
		onShow() {
			this.$fun.ajax.post('index/config', {}).then(res => {
				this.loginList = res.data.login
				this.configObj = res.data
			})
			this.$fun.ajax.post('config/sendsms').then(res => {
				// //console.log(res)
				this.config = res.data.code
			})
		},
		methods: {
			...mapMutations(['login']),
			sendCode() {
				if (this.tip) {
					this.tip = 60;
					this.timer = setInterval(() => {
						if (this.tip <= 0) {
							this.tip = this.$t('login.name10')
							clearInterval(this.timer)
							this.timer = null
						} else {
							this.tip -= 1
						}
					}, 1000)
				}
			},
			gotoApp() {
				location.href = this.configObj.download_address
			},
			inputChange(e) {
				const key = e.currentTarget.dataset.key;
				this[key] = e.detail.value;
			},
			navBack() {
				uni.navigateBack();
			},
			toRegist() {
				this.$fun.jump('/pageA/public/login', 3, 0)
			},
			async toLogin() {
				console.log(11111111)
				const {
					mobile,
					truename,
					code,
					config,
					invitation,
					password,
					paypwd
				} = this;
				const sendData = {
					mobile,
					nickname: truename,
					invitation,
					password,
					paypwd
				};
				if (!mobile) {
					this.$fun.msg('请输入手机号');
					return
				}
				// if (!code) {
				// 	this.$fun.msg(this.$t('login.name13'));
				// 	return
				// }
				// 昵称
				if (!truename) {
					this.$fun.msg(this.$t('user.name27'));
					return
				}
				//登录密码
				if (!password) {
					this.$fun.msg(this.$t('login.name17'));
					return
				}
				//交易密码
				if (!paypwd) {
					this.$fun.msg(this.$t('user.name54'));
					return
				}
				if (!/^\d{6}$/.test(paypwd)) {
					this.$fun.msg(this.$t('login.name19'));
					return
				}

				this.logining = true;

				const result = await this.$fun.ajax.post('user/register', sendData);
				if (result.code === 1) {
					this.$fun.msg('注册成功');
					setTimeout(() => {
						this.$fun.jump('/pageA/public/login', 3, 0)
						// #ifdef H5
						location.href = this.configObj.download_address
						// #endif
					}, 500)
				} else {
					this.logining = false;
				}
			}
		},
		destroyed() {
			clearInterval(this.timer)
			this.timer = null
		}

	}
</script>

<style lang='scss'>
	page {
		height: 100%;
		background-color: #080809;
	}

	.container {
		height: 100%;

		/* background: url('@/static/public/loginBgc.png') no-repeat center center;
		background-size: 100% 100%;
		padding-top: 600rpx; */
		.register_bg {
			height: 100%;

			image {
				width: 100%;
				height: 100%;
			}

		}

		.register_box {
			padding: 0 50rpx 50rpx;
			position: absolute;
			top: 520rpx;
			left: 0;
			right: 0;

			.register_item {
				position: relative;
				height: 88rpx;
				background: rgba(94, 94, 94, 0.8);
				border-radius: 50rpx;
				display: flex;
				align-items: center;
				margin: 24rpx auto;
				padding: 0 20rpx;

				input {
					width: 100%;
					font-size: 24upx;
					font-family: Microsoft YaHei;
					font-weight: 400;
					color: #ebebeb;
				}

				.inputPlaceholder {
					/* font-size: 24upx;
					font-family: Microsoft YaHei;
					font-weight: 400;
					color: #ff0000; */
				}

				.code {
					position: absolute;
					top: 25upx;
					right: 40upx;
					font-size: 26rpx;
					color: #00A3FF;
				}
			}

			.register_button {
				margin-top: 100upx;
				width: 100%;
				height: 100rpx;
				background: #1e84f1;
				border-radius: 40px;
				display: flex;
				justify-content: center;
				align-items: center;
				color: #FFFFFF;
			}
		}

		.register-section {
			/* position: absolute;
			left: 0;
			bottom: 100rpx;
			width: 100%; */
			margin-top: 20rpx;
			text-align: center;

			text {
				color: #FE555A;
				margin-left: 10upx;
			}
		}
	}
</style>